/* css Zen Garden submission 191 - 'The Diary', by Alexander Shabuniewicz, http://eye.loveline.ru/ */
/* css released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/1.0/  */
/* All associated graphics copyright 2006, Alexander Shabuniewicz */
/* Added: February 15th, 2006 */


/* IMPORTANT */
/* This design is not a template. You may not reproduce it elsewhere without the 
   designer's written permission. However, feel free to study the CSS and use 
   techniques you learn from it elsewhere. */



body{
font:11px/20px Georgia,"Times New Roman",Times,serif;
color:#666;
background:#00496C;
margin:0;
padding:0
}
h1,h2,h3{
margin:0;
padding:0
}
a{
color:#191970
}
a:hover{
color:#B22222
}
a:visited{
color:#696969
}
a abbr{
border:none
}
abbr{
cursor:help
}
/* main */
.page-wrapper{
background:url("cover_bot.png") no-repeat left bottom;
left:50%;
position:absolute;
width:770px;
margin:10px 0 20px -385px;
padding-bottom:120px
}
/* intro */
.intro{
padding:0 30px;
background:url("cover.png") repeat-y;
padding-bottom:1px
}
header{
margin:0 -30px;
background:url("cover_top.png") no-repeat
}
header h1{
background:url("csszengarden.jpg") no-repeat;
height:71px;
width:268px;
position:relative;
top:50px;
left:71px;

text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
header h2{
background:url("thebeauty.jpg") no-repeat;
height:20px;
width:299px;
position:relative;
top:55px;
left:57px;

text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
.summary{
position:absolute;
top:41px;
padding:0 0 0 380px
}
.summary p:first-child{
margin:10px 81px 0 0;
font-size:120%
}
.summary p:last-child{
margin:0;
background:url("bookmark.jpg") no-repeat;
position:absolute;
top:-25px;
left:620px;
width:61px;
height:91px;
display:block;
padding:20px 10px;
color:#fff;
font:11px/18px "Trebuchet MS",Arial,Helvetica,sans-serif
}
.summary p:last-child a{
color:#fff
}
.summary p:last-child a:hover{
text-decoration:none;
color:#ccc
}
.preamble{
padding-top:120px;
background:url("img_1.jpg") 10px 170px no-repeat;
height:1%
}
.preamble h3{
background:url("roadto.png") no-repeat;
position:relative;
left:120px;
height:44px;
width:212px;

text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
.preamble p{
text-align:left;
margin-top:-44px;
font-style:italic;
padding:0 10px 35px 380px
}
/* main content */
.supporting{
background:url("cover.png") repeat-y;
padding:0 30px
}
.explanation{
height:1%;
background:url("img_2.jpg") 370px 50% no-repeat
}
.explanation h3{
background:url("sowhat.png") no-repeat;
position:relative;
left:380px;
height:45px;
width:176px;

text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
.explanation p{
text-align:right;
margin-top:-45px;
font-style:italic;
padding:0 380px 35px 10px
}
.participation{
height:1%;
background:url("img_3.jpg") 5px 50% no-repeat
}
.participation h3{
background:url("participation.png") no-repeat;
position:relative;
left:180px;
height:45px;
width:157px;

text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
.participation p{
text-align:left;
margin-top:-45px;
font-style:italic;
padding:0 10px 35px 380px
}
.benefits{
background:url("img_4.png") 380px 50% no-repeat
}
.benefits h3{
background:url("benefits.png") no-repeat;
position:relative;
left:380px;
height:47px;
width:150px;

text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
.benefits p{
text-align:right;
margin-top:-47px;
font-style:italic;
padding:0 380px 35px 10px
}
.requirements h3{
background:url("requirements.png") no-repeat;
position:relative;
left:180px;
height:46px;
width:150px;

text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
.requirements p{
text-align:left;
margin-top:-46px;
font-style:italic;
padding:0 10px 35px 380px
}
footer{
padding-left:380px;
text-align:center
}
footer a{
color:#666;
text-decoration:none;
border:1px solid #fffcf1;
padding:5px
}
footer a:hover{
border:1px solid #ccc
}
/* notes */
.sidebar{
font-size:120%;
font-style:italic;
position:absolute;
width:300px;
bottom:70px;
left:80px
}
.sidebar h3.select{
width:142px;
height:29px;
background:url("select.png") no-repeat;
position:relative;
left:8px;
top:8px;

text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
.sidebar h3.archives{
width:74px;
height:25px;
background:url("archives.png") no-repeat;
position:relative;
left:8px;

text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
.sidebar ul{
margin:10px 5px 10px 40px;
padding:0 5px
}
.sidebar ul li{
list-style-type:none;
list-style-image:none
}
.design-selection ul li{
list-style:outside url("bull.png")
}
.sidebar ul li a{
text-decoration:none
}
.zen-resources{
font:16px/22px "Trebuchet MS",Arial,Helvetica,sans-serif;
display:block;
background:url("notes.jpg") no-repeat;
padding:20px 15px;
width:252px
}
.zen-resources ul{
margin:30px	20px 50px 25px
}
.zen-resources h3.resources{
width:85px;
height:22px;
background:url("resources.png") no-repeat;

text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
